/*
 * @Author: zeki mini
 * @Date: 2021-04-14 14:33:47
 * @LastEditors: zeki mini
 * @LastEditTime: 2021-04-14 15:12:22
 * @Description: 首页中间菜单栏
 */

import React, { Component } from 'react';
import { StyleSheet, Image, TouchableOpacity, View, Text } from 'react-native';
import { px2dp } from '@/styles';
import { insuranceMainItem1, insuranceMainItem2, insuranceMainItem3 } from '@/images';

export default class mainMiddleMenu extends React.PureComponent {
  constructor(props) {
    super(props);
  }

  static defaultProps = {
    onClickAction: () => {},
  };

  render() {
    const { onClickAction } = this.props;

    return (
      <View style={styles.container}>
        <TouchableOpacity style={styles.item} onPress={() => { onClickAction && onClickAction(1); }}>
          <View style={styles.itemCenter}>
            <Image style={styles.icon} source={insuranceMainItem1} />
            <Text style={styles.title}>保单管家</Text>
          </View>
        </TouchableOpacity>
        <TouchableOpacity style={styles.item} onPress={() => { onClickAction && onClickAction(2); }}>
          <View style={styles.itemCenter}>
            <Image style={styles.icon} source={insuranceMainItem2} />
            <Text style={styles.title}>一键申请</Text>
          </View>
        </TouchableOpacity>
        <TouchableOpacity style={styles.item} onPress={() => { onClickAction && onClickAction(3); }}>
          <View style={styles.itemCenter}>
            <Image style={styles.icon} source={insuranceMainItem3} />
            <Text style={styles.title}>我的申请</Text>
          </View>
        </TouchableOpacity>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    width: '100%',
    paddingVertical: px2dp(24 * 2),
    flexDirection: 'row'
  },
  item: {
    width: '33%',
    height: px2dp(76 * 2),
    alignItems: 'center'
  },
  itemCenter: {
    flex: 1,
    justifyContent: 'space-around',
  },
  icon: {
    width: px2dp(52 * 2),
    height: px2dp(52 * 2)
  },
  title: {
    fontSize: px2dp(14 * 2),
    color: '#2B2C2E',
    fontWeight: '500'
  },

});
